<!doctype html>
<html lang="en">

<head>
	<title>鑫洋泉运营管理平台</title>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<!-- VENDOR CSS -->
	<link rel="stylesheet" href="../assets/vendor/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="../assets/vendor/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../assets/vendor/dataTables/jquery.dataTables.min.css">
	<link rel="stylesheet" href="../assets/vendor/linearicons/style.css">
	<!-- MAIN CSS -->
	<link rel="stylesheet" href="../assets/css/main.css">
	<!-- FOR DEMO PURPOSES ONLY. You should remove this in your project -->
	<link rel="stylesheet" href="../assets/css/demo.css">
	<link rel="stylesheet" href="../assets/css/sweetalert.css">
	<!-- GOOGLE FONTS -->
	<!--<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700" rel="stylesheet">-->
	<!-- ICONS -->
	<link rel="apple-touch-icon" sizes="76x76" href="../assets/img/apple-icon.png">
	<link rel="icon" type="image/png" sizes="96x96" href="../assets/img/favicon.png">
</head>

<body>
	<!-- WRAPPER -->
	<div id="wrapper">
		<!-- NAVBAR -->
		<nav class="navbar navbar-default navbar-fixed-top">
			<h1 class="header_1">
				 鑫洋泉运营管理系统 
			</h1>
		</nav>
		<!-- END NAVBAR -->
		<!-- LEFT SIDEBAR -->
		<div id="sidebar-nav" class="sidebar">
			<div class="sidebar-scroll">
				<nav>
					<ul class="nav">
                        <li><a href="index.html" class="active"><i class="lnr lnr-home"></i> <span>首页</span></a></li>
                        <li><a href="device.html" class=""><i class="lnr lnr-chart-bars"></i> <span>车辆信息</span></a></li>
                        <li><a href="custom.html" class=""><i class="lnr lnr-chart-bars"></i> <span>客户信息</span></a></li>
                         
                        <li>
                            <a href="#"><i class="lnr lnr-chart-bars"></i> <span>SIM卡管理</span></a>
                            <ul class="nav">
                                <li><a href="cardsStatistics.html">统计信息</a></li>
                                <li><a href="cardsList.html">列表信息</a></li>
                            </ul>
                        </li>
                        <li>
							<a href="config.html"><i class="lnr lnr-chart-bars"></i> <span>配置管理</span></a>
							<ul class="nav">
								<li><a href="config.html" class=""><span>默认配置列表</span></a></li>
								<li><a href="parameters.html?1" class=""><span>解码类型</span></a></li>
								<li><a href="parameters.html?2" class=""><span>主机盒界面</span></a></li>
								<li><a href="parameters.html?3" class=""><span>前景和前后视角</span></a></li>
								<li><a href="parameters.html?4" class=""><span>转向视角</span></a></li>
								<li><a href="parameters.html?5" class=""><span>轨迹线类型</span></a></li>
						
							</ul>
						</li><!--<li><a href="device_detail.html" class=""><i class="lnr lnr-cog"></i> <span>设备详情</span></a></li>-->
                    </ul>
				</nav>
			</div>
		</div>
		<!-- END LEFT SIDEBAR -->
		<!-- MAIN -->
		<div class="main">
			<!-- MAIN CONTENT -->
			<div class="main-content">
				<div class="container-fluid">
                    <div class="row">
                        <div class="col-md-11">
					            <h3 class="page-title ">配置列表</h3>
                        </div>
                        <div class="col-md-1">
                            <!--<form class="navbar-form navbar-right">-->
                           <span class="input-group-btn"><button type="button" onclick="showModal()" class="btn btn-primary">新增</button></span>

                        </div>
                    </div>

                    <div class="row">
                        <table id="example" class="col-md-12 display" cellspacing="0" width="100%">
                        </table>
					</div>
				</div>
			</div>
			<!-- END MAIN CONTENT -->
		</div>
        <!-- 模态框（Modal） -->
        <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                        <h4 class="modal-title" id="myModalLabel"></h4>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" role="form">
                            <div class="form-group">
                                <label for="user_id" class="col-sm-3 control-label">解码类型</label>
                                <div class="col-sm-9">
                                    <select id="decodeTypeId" class="form-control"></select>
                                </div>
                            </div>
                       
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">主机盒界面</label>
                                <div class="col-sm-9">
                                    <select id="interfacedId" class="form-control"></select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">前景和前后视角</label>
                                <div class="col-sm-9">
                                    <select id="fbViewId" class="form-control"></select>
                                </div>
                            </div>
                            <!--//// decodeType interfaced  fbView turnView trackType -->
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">转向视角</label>
                                <div class="col-sm-9">
                                    <select id="turnViewId" class="form-control"></select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">轨迹线类型</label>
                                <div class="col-sm-9">
                                    <select id="trackTypeId" class="form-control"></select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">摄像头数量</label>
                                <div class="col-sm-9">
                                    <select id="cameraCount" class="form-control">
                                        <option value="4">四路摄像头(4)</option>
                                        <option value="6">六路摄像头(6)</option>
                                    </select>
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="lastname" class="col-sm-3 control-label">轨迹系数</label>
                                <div class="col-sm-9">
                                    <!--数字类型，最小值50，最大值200-->
                                    <input type="number" id="trackCoefficient" min="50" max="200" class="form-control">
                                </div>
                            </div>

                            <div class="form-group">
                                <label for="remark" class="col-sm-3 control-label">轴距</label>
                                <div class="col-sm-9">
                                    <input type="number" id="wheelBase" class="form-control"  name="birthday" value="" id="birthday"
                                        placeholder="">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="remark" class="col-sm-3 control-label">轮距</label>
                                <div class="col-sm-9">
                                    <input type="number" id="wheelTrack" class="form-control"  name="created" value="" id="created"
                                        placeholder="">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="remark" class="col-sm-3 control-label">前轮距车间距</label>
                                <div class="col-sm-9">
                                    <input type="number" id="frontWheelDist" class="form-control"  name="created" value="" id="created"
                                        placeholder="">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="remark" class="col-sm-3 control-label">屏幕参数</label>
                                <div class="col-sm-9">
                                    <input type="text" id="screenParam" class="form-control"  name="created" value="" id="created"
                                        placeholder="">
                                </div>
                            </div>
                            <input type="hidden" id="id">
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                        <button type="button" class="btn btn-primary" onClick="doEdit()">保存</button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
        </div>
        <!-- /.modal -->
		<!-- END MAIN -->
		<div class="clearfix"></div>
		<footer>
			<div class="container-fluid">
			</div>
		</footer>
	</div>
	<!-- END WRAPPER -->
	<!-- Javascript -->
	<script src="../assets/vendor/jquery/jquery.min.js"></script>
	<script src="../assets/vendor/bootstrap/js/bootstrap.min.js"></script>
	<script src="../assets/vendor/jquery-slimscroll/jquery.slimscroll.min.js"></script>
    <script src="../assets/vendor/dataTables/jquery.dataTables.min.js"></script>
	<script src="../assets/scripts/klorofil-common.js"></script>
	<script src="../assets/vendor/sweetalert.min.js"></script>
    <script>
        var showModal = function (data) {
            // $('#myModal').modal(data);
            // for(i in data) {
                
            //     $('#' + i)[0].value = data[i];
            // }
            if (data) {
                $('#id').val(data.id);
                $('#interfacedId').val(data.interfacedId);
                $('#decodeTypeId').val(data.decodeTypeId);
                $('#fbViewId').val(data.fbViewId);
                $('#turnViewId').val(data.turnViewId);
                $('#trackTypeId').val(data.trackTypeId);
                $('#cameraCount').val(data.cameraCount);
                $('#screenParam').val(data.screenParam);
                $('#trackCoefficient').val(data.trackCoefficient);
                $('#wheelBase').val(data.wheelBase);
                $('#wheelTrack').val(data.wheelTrack);
                $('#frontWheelDist').val(data.frontWheelDist);
            } else {
                cleanData();
            }
            $('#myModal').modal('show');


        }
        var cleanData = function () {
            $('#screenParam').val('');
                $('#trackCoefficient').val('');
                $('#wheelBase').val('');
                $('#wheelTrack').val('');
                $('#frontWheelDist').val('');
        }

        var initModal = function () {
            console.log('init modal');
            $.ajax(
                {
                    url: "../ws/0.1/param/ps/data",
                    // url: "../ws/0.1/vehicle",
                    // data: data,
                    type: "get",
                    contentType: "application/json; charset=utf-8",
                    beforeSend:function()
                    {
                        return true;
                    },
                    success:function(data)
                    {
                // "url": "../ws/0.1/vehicle/datas",
                        if(data.code == 200)
                        {
                            // table.ajax.url('../ws/0.1/vehicle/datas').load();
                            if(data.dataObject){
                                for(var k in data.dataObject){
                                    var j = data.dataObject[k];
                                    for(var i = 0; i < j.length; i++){
                                        $('#' + k + 'Id').append("<option value='" + j[i].id + "'>" + j[i].value + "</option>");
                                    }
                                    
                                }
                            }
                            // $('#decodeType').append("<option value='Value'>Text</option>")
                        }
                        else
                        {
                            $("#warningMessage").html(data.message);
                            alert(data.message);
                        }
                        cleanData();
                        $('#myModal').modal('hide');
                    },
                    error: function()
                    {
                        alert('请求出错');
                    },
                    complete: function()
                    {
                        $('#acting_tips').hide();
                    }
                });

        }
        initModal();
        var getData = function () {
            var data = {};
            data.id = $('#id')[0].value;
            data.decodeTypeId = $('#decodeTypeId')[0].value;
            data.interfacedId = $('#interfacedId')[0].value;
            data.fbViewId = $('#fbViewId')[0].value;
            data.turnViewId = $('#turnViewId')[0].value;
            data.trackTypeId = $('#trackTypeId')[0].value;
            data.cameraCount = $('#cameraCount')[0].value;
            data.screenParam = $('#screenParam')[0].value;
            data.trackCoefficient = $('#trackCoefficient')[0].value;
            data.wheelBase = $('#wheelBase')[0].value;
            data.wheelTrack = $('#wheelTrack')[0].value;
            data.frontWheelDist = $('#frontWheelDist')[0].value;
            return data;
        }
        var doAjax = function (data, url, fn) {
            $.ajax(
                {
                    url: url,
                    // url: "../ws/0.1/vehicle",
                    // data: data,
                    type: "post",
                    contentType: "application/json; charset=utf-8",
                    data: JSON.stringify(data),
                    dataType: "json",
                    beforeSend:function()
                    {
                        return true;
                    },
                    success:function(data)
                    {
                // "url": "../ws/0.1/vehicle/datas",
                        if(data.code == 200)
                        {
                            table.ajax.url('../ws/0.1/param/ps').load();
                        }
                        else
                        {
                            alert(data.message);
                        }
                        $('#id').val('');
                        $('#myModal').modal('hide');
                    },
                    error: function()
                    {
                        alert('请求出错');
                    },
                    complete: function()
                    {
                        $('#acting_tips').hide();
                    }
                });

        }
        var doEdit = function () {

            var url = '';
            if($('#id').val()) {
                url = '../ws/0.1/param/ps/update';
            } else {
                url = '../ws/0.1/param/ps';
            }
            doAjax(getData(), url);
            
        }

        var deleteCustom = function (id) {
            swal({
                title: "确定删除吗？",    
                type: "warning",   
                showCancelButton: true,    
                confirmButtonColor: "#DD6B55",
                cancelButtonText: "取消", 
                confirmButtonText: "确定！",    
                closeOnConfirm: false }, 
                function() { 
                
                    $.ajax(
                        {
                            url: "../ws/0.1/param/ps?id=" + id,
                            // url: "../ws/0.1/vehicle",
                            // data: data,
                            type: "delete",
                            contentType: "application/json; charset=utf-8",
                            dataType: "json",
                            beforeSend:function()
                            {
                                return true;
                            },
                            success:function(data)
                            {
                        // "url": "../ws/0.1/vehicle/datas",
                                if(data.code == 200)
                                {
                                    table.ajax.url('../ws/0.1/param/ps').load();
                                    swal("删除！", "删除成功", "success"); 
                                    // table.ajax.url('../ws/0.1/vehicle/datas').load();
                                }
                                else
                                {
                                    sweetAlert("error", data.message,"error");
                                }
                            },
                            error: function()
                            {
                                sweetAlert("error", "请求出错","error");
                            },
                            complete: function()
                            {
                            }
                        });
                });

        }

    var table = $('#example').DataTable( {
        oLanguage: {
            "sUrl": "../assets/vendor/dataTables/zh_CN.json"
        },
        scrollX: true,
        //左下角信息
        info: false,
        //关闭行数选择
        "lengthChange": false,
        //关闭本地搜索
        "searching": false,
        //关系列排序
         "columns": [
        ],
        "columnDefs": [
            {
                "targets": [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                "visible": false,
                "searchable": false
            }
        ],
      length: 10,
      
        // "ajax": '../assets/device_ajax.txt'
         //"serverSide": true,//分页，取数据等等的都放到服务端去
          //  "deferRender": true,//当处理大数据时，延迟渲染数据，有效提高Datatables处理能力
            "destory": true,
            "ajax": {
                "dataType": 'json',
                "type": "get",
                "url": "../ws/0.1/param/ps",
                // "url": "../ws/0.1/customer/datas",
                "data": function (d) {
                   //console.log(d)
                    // d.id = id;
                },
                "async": false
            },

            //{ id, mobile, nickName, sex, birthday, created } 
            //序列	解码类型	界面	前后视角	转向视角	轨迹线类型	摄像头数量	参数	时间	操作
            "columns": [
                {
                    "data": "id",
                    "title": ""
                    
                }, {
                    "data": "decodeTypeId",
                    "title": ""
                }, {
                    "data": "decodeTypeValue",
                    "title": ""
                }, {
                    "data": "fbViewId",
                    "title": ""
                }, {
                    "data": "fbViewValue",
                    "title": ""
                }, {
                    "data": "turnViewId",
                    "title": ""
                }, {
                    "data": "turnViewValue",
                    "title": ""
                }, {
                    "data": "interfacedId",
                    "title": ""
                }, {
                    "data": "interfacedValue",
                    "title": ""
                }, {
                    "data": "trackTypeId",
                    "title": ""
                }, {
                    "data": "trackTypeValue",
                    "title": ""
                }, {
                    "data": "id",
                    "title": "序列"
                }, {
                    
                    "data": "decodeTypeName",
                    "title": "解码类型"
                }, {
                    "data": "interfacedName",
                    "title": "界面"
                }, {
                    "data": "fbViewName",
                    "title": "前后视角"
                 }, {
                    "data": "turnViewName",
                    "title": "转向视角"
                }, {
                    "data": "trackTypeName",
                    "title": "轨迹线类型"
                }, {
					"data": "cameraCount",
                    "title": "摄像头数量",
                    render: function (row) {
                        if(row == 4) {
                            return '四路摄像头';
                        } if (row == 6) {
                            return '六路摄像头'
                        } else {
                            return '未知';
                        }
                    }
                }, {
                    "data": function(row){
                        return row;
                    },
                    "title": "参数",
                    "maxWidth": 100,
                    render: function (row, data) {
                        return "轨迹系数：" + row.trackCoefficient +"<br/>轴距:" + row.wheelBase+ "<br/>轮距:"+ row.wheelTrack + "<br/>前轮距车间距:"+ row.frontWheelDist + "<br/>屏幕参数:<br/>" + row.screenParam ;
                    }
                }, {
                    "data": function (row) {
                        return row;
                    },
                    "title": "时间",
                    render: function (row) {
                        return "创建时间：<br/>" + row.created + "<br/>" + "修改时间：<br/>" + row.updated;
                    }
                // }, {
                //     "data": "updated",
                //     "title": "修改时间"
				}, {
                    "data": function ( row, type, val, meta ) {
                        return row;
                    },
                    "title": "操作",
                    width: 50,
                    render: function (row, data) {

                        return "<a class='' href='#' onclick='showModal(" + JSON.stringify(row) + ")'>编辑</a><span>  </span>"+"<a class='' href='#' onclick='deleteCustom(" + row.id + ")'>删除</a>";
                    }
                }
            ]
    } );
    
    </script>
</body>

</html>
